<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title> 凑品单--慢慢买比价网</title>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet/less" href="./css/base.less">
    <link rel="stylesheet/less" href="./css/CoudanList.less">
    <link rel="stylesheet" href="./lib/bootstrap/css/bootstrap.min.css">
    <script src="./lib/less/less.min.js"></script>
</head>

<body>
    <!--头部-->
    <div class="header">
        <span class="le">
            <a href="../index.html" class="glyphicon glyphicon-menu-left"></a>
        </span>
        <h1>凑品单</h1>
    </div>
    <!--主体-->
    <div class="cundan-box">
        <div class="list">
            <div class="nav">
                <div class="filter">
                    <ul>
                        <li>
                            <a href="javascipt:" id="on">京东
                            <i class="glyphicon glyphicon-triangle-bottom" id="a"></i>
                        </a>
                        </li>
                        <li>
                            <a href="javascipt:" id="area">华北
                            <i class="glyphicon glyphicon-triangle-bottom" id="b"></i>
                        </a>
                        </li>
                        <li>
                            <a href="javascipt:" id="money">1元
                            <i class="glyphicon glyphicon-triangle-bottom" id="c"></i>
                        </a>
                        </li>
                    </ul>
                </div>
                <div class="search">
                    <i class="icon-search"></i>
                </div>
                <!--下拉框-->
                <div class="popsort">
                    <ul>
                        <li class="onto">
                            <a href="#"></a>
                            <span class="children"></span>
                        </li>
                    </ul>
                </div>
                <div class="popsbox">
                    <ul>
                        <li>
                            <a href="#"></a>
                            <span class="glyphicon glyphicon-ok"></span>
                        </li>
                    </ul>
                </div>
                <div class="popsbtn">
                    <ul>
                        <li>
                            <a href="#">全部价格</a>
                            <span class="glyphicon glyphicon-ok"></span>
                        </li>
                        <li>
                            <a href="#">1-3元</a>
                            <span></span>
                        </li>
                        <li>
                            <a href="#">3-5元</a>
                            <span></span>
                        </li>
                        <li>
                            <a href="#">5-10元</a>
                            <span></span>
                        </li>
                        <li>
                            <a href="#">10-15元</a>
                            <span></span>
                        </li>
                        <li>
                            <a href="#">15元以上</a>
                            <span></span>
                        </li>
                    </ul>
                </div>
                <div class="popsset">
                    <div class="one clearfix">
                        <div class="txt">
                            <input type="search" value="" oninput="delInput();" class="border-img" placeholder="搜索您想要的凑单品">
                        </div>
                        <div class="smt">
                            <input type="button" value="搜索" class="derese">
                        </div>
                    </div>
                    <div class="two">
                        <div class="t">排序</div>
                        <div class="c">
                            <div class="clearfix clear clocr">
                                <dd>
                                    <a href="javascript:;" id="xiaoliang" class="beset">销量</a>
                                </dd>
                                <dd>
                                    <a <a href="#" id="jiagesheng">价格↑</a>
                                </dd>
                                <dd>
                                    <a <a href="#" id="jiagejiang">价格↓</a>
                                </dd>
                            </div>
                        </div>
                    </div>
                    <div class="there">
                        <div class="t">分类</div>
                        <div class="c">
                            <div class="clearfix clear clorc">
                                <dd>
                                    <a href="javascript:;" class="bset">全部</a>
                                </dd>
                                <dd>
                                    <a href="javascript:;">家具</a>
                                </dd>
                                <dd>
                                    <a href="javascript:;">数码</a>
                                </dd>
                                <dd>
                                    <a href="javascript:;">办公</a>
                                </dd>
                                <dd>
                                    <a href="javascript:;">个护</a>
                                </dd>
                                <dd>
                                    <a href="javascript:;">食品</a>
                                </dd>
                                <dd>
                                    <a href="javascript:;">母婴</a>
                                </dd>
                                <dd>
                                    <a href="javascript:;">服饰</a>
                                </dd>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--商品-->
            <div class="section">
                <ul>
                    <li>
                        <a href="#">
                            <div class="pic">
                                <img src="" alt="">
                            </div>
                            <div class="title"></div>
                            <div class="other">
                                <div class="price"></div>
                                <div clearfix></div>
                            </div>
                        </a>
                    </li>
                </ul>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
    <div class="Page_loading" style="display: block;">
        <em><img src="./images/loading.gif" width="32" height="32"></em><span></span>
    </div>
</body>
<script src="./lib/jquery/jquery-1.12.2.min.js"></script>
<script src="./lib/bootstrap/js/bootstrap.min.js"></script>
<script src="./lib/template/template.js"></script>
<script src="./js/CoudanList.js"></script>

<script type="text/html" id="CoudanList-top-1">
    {{each result as value i}}
    <li>
        <a href="javascript:;" name="{{value.shopId}}" id="on">{{value.shopName}}</a>
        <span class="glyphicon {{if i<1 }}glyphicon-ok{{/if}}"></span>
    </li>
    {{/each}}
</script>

<script type="text/html" id="CoudanList-top-2">
    {{each result as value i}}
    <li>
        <a href="javascript:;" name="{{value.areaId}}" id="on">{{value.areaName}}</a>
        <span class="glyphicon {{if i<1 }}glyphicon-ok{{/if}}"></span>
    </li>
    {{/each}}
</script>

<script type="text/html" id="CoudanList-top-3">
    {{each result as value i}}
    <li>
        <a href="#">
            <div class="pic">
                <img src="{{value.productImg}}">
            </div>
            <div class="title"> {{value.productName}}</div>
            <div class="other">
                <div class="price">{{value.productPrice}}</div>
                <div clearfix></div>
            </div>
        </a>
    </li>
    {{/each}}
</script>

</html>